<template>
    <div class="layui-col-md12">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header"><span><i class="fa fa-lock"></i>  账户冻结</span></div>
                <div class="layui-card-body">
                    <div class="layui-form-item">
                        <img src="/loginImg/blockAccount.jpg" alt="" class="tranferimg" style="    width: 50%;float:left;">
                        <span class="my_span">银行账户冻结</span>
                        <input type="text" v-model="accountId" maxlength="18" lay-verify="title" autocomplete="off" placeholder="请输入要冻结的账户" class="layui-input my_input" oninput = "value=value.replace(/[^\d]/g,'')"> 
                        <input type="text" v-model="accountName" lay-verify="title" autocomplete="off" placeholder="请输入要冻结账户名" class="layui-input my_input">     
                        <input type="text" v-model="uid" maxlength="18" lay-verify="title" autocomplete="off" placeholder="请输入要冻结账户身份证" class="layui-input my_input" oninput = "value=value.replace(/[^\d]/g,'')">     
                        <input type="text" v-model="utelephone" maxlength="11" lay-verify="required" placeholder="请输入账户11位电话号码" autocomplete="off" class="layui-input my_input" oninput = "value=value.replace(/[^\d]/g,'')">
                        <button class="btn btn-primary" @click.prevent="blockOrUnBlockAccount" data-dismiss="modal" style="width: 45%;margin-top:15px;position: relative;left: 3%;">账户冻结</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
import Qs from 'qs'
export default {
    data (){
        return {
            accountId:'',//账户
            accountName:'',//账户名
            uid:'',//用户身份证
            utelephone:'',//用户电话号码
        }
    },
    methods:{
        blockOrUnBlockAccount:function(){//账户冻结
            var accountIdRegix=/^[\d]{18}$/;
            var teleRegix=/^[\d]{11}$/;
            if(!this.accountId.match(accountIdRegix)){
                this.$message.error("账户需要18位");
                return false;
            }else if(!this.uid.match(accountIdRegix)){
                this.$message.error("身份证需要18位");
                return false;
            }else if(!this.utelephone.match(accountIdRegix)){
                this.$message.error("电话号码需要11位");
                return false;
            }else{
                var data=Qs.stringify({
                "cardId":this.accountId,
                "uname":this.accountName,
                "uid":this.uid,
                "utelephone":this.utelephone
                })
                this.$axios
                .post('/bk-user/blockOrUnBlockAccount/1',
                        data,
                        {headers:{'Content-Type':'application/x-www-form-urlencoded'}}
                )
                .then(result => {
                    if(result.data.code===200){
                        alert(this.accountId+result.data.message);
                        $('input').each(function () {//清空表单
                            $(this).val('');
                        });
                    }else{
                        this.$message.error(result.data.message);
                    }
                })
                .catch(failResponse => {
                    
                })
            }
        }
    }
}
</script>
<style>
    .my_input{
        width: 45%;
        margin-top:30px;
        position: relative;
        left: 3%;
    }
    .my_span{
        display:inline-block;
        margin-top:10px;
        margin-bottom:10px;
        position: relative;
        left: 3%;    
        color: lightgray;
        font-size: 25px;
    }
</style>
